<script type="text/javascript">
function agregar_etiqueta() {
  var boxIdEtiqueta = $('#f_txt_etiqueta_id');
  var idEtiqueta = boxIdEtiqueta.val().trim();
  if (idEtiqueta.length > 0) {
    var boxSelectVisible = $('#sel_etiquetas_visible');
    var boxSelect = $('#sel_etiquetas');
    var boxTextoEtiqueta = $('#f_txt_etiqueta');
    if($("#sel_etiquetas option[value="+ idEtiqueta +"]").length == 0) {
      // No se ha cargado el elemento aún
      boxSelectVisible.append("<option value='"+boxIdEtiqueta.val().trim()+"'>"+boxTextoEtiqueta.val().trim()+"</option>");
      boxSelect.append("<option value='"+boxIdEtiqueta.val().trim()+"' selected>"+boxTextoEtiqueta.val().trim()+"</option>");
    }
    boxIdEtiqueta.val('');
    boxTextoEtiqueta.val('');
  }
  else bootbox.alert('Debe buscar una etiqueta antes de continuar. Ingrese al menos 3 letras para realizar la búsqueda.');
}

function quitar_etiqueta() {
  var boxSelecciones = $('#sel_etiquetas_visible option:selected');
  if(boxSelecciones.val() != null) {
    boxSelecciones.each( function() {
      $("#sel_etiquetas option[value='"+$(this).val()+"']").remove();
      $(this).remove();
    });
  }
  else bootbox.alert('Debe seleccionar al menos una etiqueta para quitar antes de continuar.');
}
</script>

<?php
$controlador = 'gest_etiquetas';
$id_elem = '';
$entidad = 'Etiqueta';
$nombre_elem = '';
$tamanio_input = 5;
$tamanio_label = 3;
$label = 'Buscar etiqueta';
echo $this->extras_form->inputAutocompletar_etiqueta($controlador, $id_elem, $entidad, $nombre_elem, $tamanio_input, $tamanio_label, $label);
?>

<div class="form-group">
  <label class="col-sm-3 control-label">Etiquetas</label>
  <div class="col-sm-5">
    <?php
    $opcionesEtiquetas = array();
    if(!isset($opcionesSel)) $opcionesSel = array();
    if(isset($listado_etiquetas)){
      foreach ($listado_etiquetas as $etiq) { 
        $opcionesEtiquetas[$etiq->id] = $etiq->nombre;
        echo $etiq->nombre;
      }
    }
    echo form_dropdown('sel_etiquetas_visible[]', $opcionesEtiquetas, array(), "id = 'sel_etiquetas_visible' multiple class = 'form-control' style='height:200px'");
    echo form_dropdown('sel_etiquetas[]', $opcionesEtiquetas, $opcionesSel, "id = 'sel_etiquetas' multiple class = 'form-control' style='height:200px; display:none'"); ?>
  </div>
  <div class="col-sm-2">
    <button onclick="quitar_etiqueta()" type='button' class = 'btn btn-default' title = 'Quitar etiqueta' alt = 'Quitar etiqueta'>
      <span><i class='fa fa-trash-o txt-error'></i></span>
    </button>
  </div>
</div>